<!DOCTYPE html>
<html lang="en" class="no-js">

<head>
    <meta charset="utf-8">
    <title>登录</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="Shortcut Icon" href="/static/img/favicon.ico" type="image/x-icon" />
    <!-- CSS -->
    <link rel="stylesheet" href="/static/css/reset.css">
    <link rel="stylesheet" href="/static/css/supersized.css">
    <link rel="stylesheet" href="/static/css/login.css">

    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
            <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
</head>

<body oncontextmenu="return true">
    <div class="page-container">
        <h1>Just For Fun</h1>
     
            <div>
                <input type="text" name="username" class="username" placeholder="用户名" autocomplete="off" />
            </div>
            <div>
                <input type="password" name="password" class="password" placeholder="密码" oncontextmenu="return false" onpaste="return false" />
            </div>
            <button id="submit" type="button">登录</button>
        <div class="connect">
            <p>If we can only encounter each other rather than stay with each other,then I wish we had never encountered.</p>
            <p style="margin-top:20px;">如果只是遇见，不能停留，不如不遇见。</p>
        </div>
    </div>
    <div class="alert" style="display:none">
        <h2>消息</h2>
        <div class="alert_con">
            <p id="ts"></p>
            <p style="line-height:70px"><a class="btn">确定</a></p>
        </div>
    </div>

    <!-- Javascript -->
    <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
    <script src="static/js/supersized.3.2.7.min.js"></script>
    <script src="static/js/supersized-init.js"></script>
    <script>
        $(".btn").click(function() {
            is_hide();
        })
        var u = $("input[name=username]");
        var p = $("input[name=password]");
        $("#submit").live('click', function() {
            if (u.val() == '' || p.val() == '') {
                $("#ts").html("用户名或密码不能为空~");
                is_show();
                return false;
            } else {
                $.ajax({
                    url: '/api/user/login',
                    type: 'post',
                    data: {
                        username: u.val(),
                        password: p.val()
                    },
                    success: function(data) {
                        if (data.errno == 1000) {
                            $("#ts").html(data.errmsg);
                            is_show();
                        } else {
                            window.location.href = '/admin/index';
                        }
                    },
                    error: function(error) {
                        console.log(error);
                    }
                });
                // var reg = /^[0-9A-Za-z]+$/;
                // if (!reg.exec(u.val())) {
                //     $("#ts").html("用户名错误");
                //     is_show();
                //     return false;
                // }
            }
        });
        window.onload = function() {
            $(".connect p").eq(0).animate({
                "left": "0%"
            }, 600);
            $(".connect p").eq(1).animate({
                "left": "0%"
            }, 400);
        }

        function is_hide() {
            $(".alert").animate({
                "top": "-40%"
            }, 300)
        }

        function is_show() {
            $(".alert").show().animate({
                "top": "45%"
            }, 300)
        }
    </script>
</body>

</html>